{% extends "personal_center/base.html" %}
{% load state_display %}

{% block right_content %}

<div style="width: 100%;height: 40px;line-height: 40px;border-bottom: #cfcfcf solid 1px;">
    <div id="form-tab" onclick="label_switching('form_design', 'flow_design', 'form-tab', 'flow-tab')"
         class="form-flow form-flow-add-color" style="display: inline-block">流程发起
    </div>
    <div id="flow-tab" onclick="label_switching('flow_design', 'form_design', 'flow-tab', 'form-tab')"
         class="form-flow" style="display: inline-block">查看流程
    </div>
    <button type="submit" class="btn1" data-clipboard-text="testing" id="pop_page"
            style="display:inline-block; float: right;height: 30px;margin-top: 5px;margin-right: 10px;background: #00a0e9;color: white;line-height: 10px;width: 70px;border: #00a0e9 solid 1px;border-radius: 3px"
            onclick="pop_page()">提交审批
    </button>
</div>

<div id="form_design" class="container-fluid" style="padding:0; margin:0;">
    <div class="row-fluid clearfix">
        <div class="col-md-12 column">
            <div style="width:1080px; margin:0 auto; margin-top:20px;">
                <div class="conference-cont">
                    <div class="wrapper wrapper-content">
                        <div class="row"
                             style="border-left: 2px dashed rgba(0,0,0,0.12);border-right: 2px dashed rgba(0,0,0,0.12);border-bottom: 2px dashed rgba(0,0,0,0.12);">
                            <div id="colzuo" class="col-sm-12" style="border-right: 2px dashed rgba(0,0,0,0.12);">
                                <div class="ibox float-e-margins">
                                    <div class="ibox-content">
                                        <div class="row form-body form-horizontal m-t">
                                            {% autoescape off %}{{ data.business_html }}{% endautoescape %}
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="flow_design" class="container-fluid" style="padding:0; margin:0;display: none;">
    <div class="row-fluid clearfix">
        <div class="col-md-12 column">
            <div style="width:1080px; margin:0 auto; margin-top:20px;">
                <div class="conference-cont" style="height: 640px;">
                    <div class="wrapper wrapper-content">
                        <div class="row"
                             style="border-left: 2px dashed rgba(0,0,0,0.12);border-right: 2px dashed rgba(0,0,0,0.12);border-bottom: 2px dashed rgba(0,0,0,0.12);">
                            <div class="container device" style="width: 75%;padding: 0;margin: 0;">
                                <div id="deviceRight" style="height: 600px;">
                                    <!--                                        <button class="btn1" id="save_data"> 保存 </button>-->
                                    <div id="main">
                                        {% autoescape off %}{{ data.process_html }}{% endautoescape %}
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" src="../../static/system_setup/flow_cerate/js/jquery.jsPlumb.min.js"></script>
<script type="text/javascript" src="../../static/system_setup/flow_cerate/js/index.js"></script>

<script>
    //时间初始化
    $(".form_datetime").datetimepicker({
        language: 'zh-CN', //日期
        format: "yyyy/mm/dd hh:ii",
        initialDate: new Date(), //初始化当前日期
        autoclose: true, //选中自动关闭
        todayBtn: true //显示今日按钮
    });

    function label_switching(tab_1, tab_2, id_1, id_2) {
        document.getElementById(id_1).className = 'form-flow form-flow-add-color';
        document.getElementById(id_2).className = 'form-flow';
        document.getElementById(tab_1).style.display = 'block';
        document.getElementById(tab_2).style.display = 'none';
    }

    function fill_val() {
        return false
    }
    function click_ul(ele, tag_id) {
        if (ele === "gongwen") {
            if (tag_id === "dispatch") {
                if (document.getElementById("jiantou").className === "iconfont icon-jiantou-shang"){
                    document.getElementById("jiantou").className = "iconfont icon-jiantou-xia";
                    document.getElementById("dispatch").style.display = "inline-block";
                }else {
                    document.getElementById("jiantou").className = "iconfont icon-jiantou-shang";
                    document.getElementById("dispatch").style.display = "none";
                }
            }else if (tag_id === "Jeremy_levin"){
                if (document.getElementById("jiantou1").className === "iconfont icon-jiantou-shang"){
                    document.getElementById("jiantou1").className = "iconfont icon-jiantou-xia";
                    document.getElementById("Jeremy_levin").style.display = "inline-block";
                }else {
                    document.getElementById("jiantou1").className = "iconfont icon-jiantou-shang";
                    document.getElementById("Jeremy_levin").style.display = "none";
                }
            }
        }
    }
</script>
{% endblock %}